import { defineProps, PropType, reactive } from 'vue'
import { CenterApi, CenterVO } from '@/api/res/ResCenter'
import { DsgnBasicVo } from '@/api/res/approval/vo/DsgnBasicVo'

export enum WebDesignerMode {
  FormCreate = 1,
  FormV3 = 2,
  FlowDesigner = 3
}

export interface DesignerMixinData {
  /**
   * 设计对象
   */
  dsgnItem: {
    type: CenterVO | null
    required: true
  }
  /**
   * 操作对象
   */
  actionItem: {
    type: any
    required: true
  }
}

export const useDesignerMixin = (props: DesignerMixinData) => {
  const getTitle = () => {
    return props.dsgnItem?.name || 'Designer'
  }
  const getResId = () => {
    return props.dsgnItem?.id || ''
  }

  // const loadDesignerData= async ()=>{
  //
  //   const resId = useDesigner.getResId()
  //   if (resId) {
  //     const resModel = await CenterApi.getDsgnById(useDesigner.getResId())
  //
  //     debugger;
  //     dsgnModelId.value = resModel.modelId
  //     await fillDsgnMounted()
  //   }
  //
  // }

  const approvalBasicVo = ref<DsgnBasicVo>(new DsgnBasicVo())
  const getBasicInfo = () => {
    return Object.assign(approvalBasicVo.value, {
      icon: props.dsgnItem.icon,
      dsgnId: props.dsgnItem.id,
      title: props.dsgnItem.name,
      remark: props.dsgnItem.remark,
      category: props.dsgnItem.category,
      resId: props.dsgnItem.id
    })
  }

  const getActionItem = () => {
    return props.actionItem
  }

  const getDsgnItem = () => {
    return props.dsgnItem
  }

  return {
    props,
    getActionItem,
    getBasicInfo,
    getDsgnItem,
    getTitle,
    getResId
  }
}
